<template>
	<view class="page" :style="loading ? 'opacity: 0;' : 'opacity: 1;'">
		<!--  v-model="dataList" @query="queryList" -->
		<!--  refresher-only @onRefresh="onRefresh" -->
		<pageTxt>
			<z-paging ref="paging" :paging-style="{ 'background-color': '#f7f7f7', height: '100%', width: '100%' }">
				<!-- 头部 -->
				<template slot="top">
					<u-navbar :fixed="fasle" title="工作台" leftIcon=" "></u-navbar>
				</template>
				<view class="content">
					<template v-for="(item, index) in dataList">
						<view class="item" :key="index" v-if="$menuShow(item.menu)">
							<view class="item-title">{{ item.title }}</view>
							<view class="item-list flex ac flex-wrap">
								<template v-for="(child, childIndex) in item.list">
									<view class="item-href flex flex-col ac jc" :key="childIndex" @click="navtoFunc(child)" v-if="$menuShow(child.menu)">
										<image :src="child.icon" mode="widthFix" class="icon"></image>
										<text class="txt">{{ child.title }}</text>
									</view>
								</template>
							</view>
						</view>
					</template>
				</view>
				<!-- 尾部 -->
				<tabbar slot="bottom"></tabbar>
			</z-paging>
		</pageTxt>
	</view>
</template>

<script>
export default {
	data() {
		return {
			loading: true,
			dataList: [
				{
					title: '销售管理',
					menu: '/saleManagement',
					list: [
						{
							icon: '/static/images/khgl.png',
							title: '客户管理',
							menu: '/khgl',
							path: '/pagesA/saleManagement/saleManagement',
							query: {
								tabIndex: 1
							}
						},
						{
							icon: '/static/images/xmgl.png',
							title: '项目管理',
							menu: '/xmgl',
							path: '/pagesA/saleManagement/saleManagement',
							query: {
								tabIndex: 2
							}
						},
						{
							icon: '/static/images/htgl.png',
							title: '合同管理',
							menu: '/htgl',
							path: '/pagesA/saleManagement/saleManagement',
							query: {
								tabIndex: 3
							}
						},
						{
							icon: '/static/images/dkrz.png',
							title: '对客日志',
							menu: '/dkrz',
							path: '/pagesA/saleManagement/saleManagement',
							query: {
								tabIndex: 4
							}
						},
						{
							icon: '/static/images/yhsp.png',
							title: '优惠审批',
							menu: '/yhgl',
							path: '/pagesA/saleManagement/saleManagement',
							query: {
								tabIndex: 5
							}
						},
						{
							icon: '/static/images/xmpf.png',
							title: '项目评分',
							menu: '/xmpf',
							path: '/pagesA/saleManagement/saleManagement',
							query: {
								tabIndex: 6
							}
						}
					]
				},
				{
					title: '工程管理',
					menu: '/engineeringManagement',
					list: [
						{
							icon: '/static/images/sggl.png',
							title: '施工管理',
							menu: '/sggl',
							path: '/pagesA/engineeringManagement/engineeringManagement',
							query: {
								tabIndex: 1
							}
						},
						{
							icon: '/static/images/sgrz.png',
							title: '施工日志',
							menu: '/sgrz',
							path: '/pagesA/engineeringManagement/engineeringManagement',
							query: {
								tabIndex: 2
							}
						},
						{
							icon: '/static/images/zlys.png',
							title: '质量验收',
							menu: '/zlys',
							path: '/pagesA/engineeringManagement/engineeringManagement',
							query: {
								tabIndex: 3
							}
						},
						{
							icon: '/static/images/gzzg.png',
							title: '工程整改',
							menu: '/gczgd',
							path: '/pagesA/engineeringManagement/engineeringManagement',
							query: {
								tabIndex: 4
							}
						},
						{
							icon: '/static/images/shgl.png',
							title: '售后管理',
							menu: '/shgl',
							path: '/pagesA/engineeringManagement/engineeringManagement',
							query: {
								tabIndex: 5
							}
						}
					]
				},
				{
					title: '设计管理',
					menu: '/design',
					list: [
						{
							icon: '/static/images/kcgl.png',
							title: '勘场管理',
							menu: '/kcgl',
							path: '/pagesA/designManagement/designManagement',
							query: {
								tabIndex: 1
							}
						},
						{
							icon: '/static/images/sjgl.png',
							title: '设计管理',
							menu: '/sjgl',
							path: '/pagesA/designManagement/designManagement',
							query: {
								tabIndex: 2
							}
						}
					]
				},
				{
					title: '预结算管理',
					menu: '/preSettlementManagement',
					list: [
						{
							icon: '/static/images/ysgl.png',
							title: '预算管理',
							menu: '/ysgl',
							path: '/pagesA/preSettlementManagement/preSettlementManagement',
							query: {
								tabIndex: 1
							}
						},
						{
							icon: '/static/images/jsgl.png',
							title: '结算管理',
							menu: '/jsgl',
							path: '/pagesA/preSettlementManagement/preSettlementManagement',
							query: {
								tabIndex: 2
							}
						},
						{
							icon: '/static/images/zjxgl.png',
							title: '增减项管理',
							menu: '/zjxgl',
							path: '/pagesA/preSettlementManagement/preSettlementManagement',
							query: {
								tabIndex: 3
							}
						}
					]
				},
				{
					title: '财务管理',
					menu: '/financeManagement',
					list: [
						{
							icon: '/static/images/sfkgl.png',
							title: '收付款管理',
							menu: '/sfkgl',
							path: '/pagesA/financialManagement/financialManagement',
							query: {
								tabIndex: 0
							}
						}
					]
				}
			]
		};
	},
	onLoad() {
		setTimeout(() => {
			this.loading = false;
		}, 200);
		// this.$menuShow();
	},
	onShow() {
		uni.hideTabBar();
	},
	methods: {
		// 参数拼接
		buildUrl(baseUrl, params) {
			let query = [];
			for (const key in params) {
				if (params[key] != null && params[key] !== '') {
					// 过滤空值
					query.push(`${encodeURIComponent(key)}=${encodeURIComponent(params[key])}`);
				}
			}
			return baseUrl + (query.length ? '?' + query.join('&') : '');
		},
		onRefresh() {
			this.$refs.paging.complete();
		},
		navtoFunc(item) {
			let url = this.buildUrl(item.path, item.query);
			uni.navigateTo({
				url
			});
		}
	}
};
</script>

<style lang="scss" scoped>
@import 'workbenches.scss';
</style>
